<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>Visual page editor basic tests ("overlay" Dijit widget support)</title>

	<!-- CUSTOMIZATION: Make sure "../" URLs for href/src attributes are correct -->
	<link rel="stylesheet" type="text/css" href="../css/testplan.css" />
</head>

<body>
	<div class="navbar">
		<a href="./" title="show directory contents"><code>./</code> (show contents of this directory)</a>
		&nbsp;&nbsp;&nbsp;&nbsp;
		<a href="../" title="show directory contents"><code>../</code> (show contents of parent directory)</a>
	</div>
	<hr />
	<h1 class="test_title">Visual page editor basic tests ("overlay" Dijit widget support)</h1>

	<h2 class="test_section">Tooltip placement</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>Standard setup things: Clear the browser cache. Launch the Maqetta server. 
				Login if necessary. 
				In some cases, you'll want to setup a virgin user environment by creating a whole new user login.</li>
		<li>Click on the "New file" icon on the main toolbar. Choose any filename.</li>
		<li>Drag a Button onto the canvas.  Set the text on the Button to "Show Dialog"</li>
		<li>Drag a Tooltip on to the Button.  The Toolbar will be associated with the Button.  Put text in the tooltip like "click here to show the dialog"</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>Click on the Tooltip in the Outline view and it should be made visible, adjacent to the Button.</li>
		<li>Click on another element and the Tooltip should go away.</li>
		<li>Examine the States view.  In addition to the "Normal" state, you should see a state representing the Tooltip visible state with a unique ID, e.g. _show:dijit_Tooltip_96.</li>
	</ol>

	<h2 class="test_section">Dialog placement</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>Continuing from the previous example, drag a Dialog on the canvas.</li>
		<li>Drag a Button widget onto the Dialog.  Set the label to "Close".</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>Click on another element and the Dialog should go away.</li>
		<li>Click on the Dialog in the Outline view and it should be made visible again.</li>
		<li>Examine the States view.  In addition to the "Normal" and Tooltip states, you should see a state representing the Dialog visible state with a unique ID, e.g. _show:dijit_Dialog_0.</li>
	</ol>

	<h2 class="test_section">Dialog states</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>Select the "Show Dialog" Button and go to the events section in the properties palette.  Set the onclick event to set the _show state for the Dialog.</li>
		<li>Select the "Close" Button in the Dialog from the outline view and go to the events section in the properties palette.  Set the onclick event to set the Normal state.</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>Go to preview mode.</li>
		<li>Hover over the "Show Dialog" button.  You should see the Tooltip pop up.</li>
		<li>Click on the "Show Dialog" Button.  The dialog should appear.</li>
		<li>Click on the "Close" Button.  The dialog should disappear.</li>
	</ol>

</body>
</html>
